<script lang="tsx">
/**
 * 博客文章
 */
export default {
  name: "blog-text"
}
</script>

<script lang="tsx" setup>
import {ref} from "vue";
import {convertEnumToList, definePageModel, processRequest, PageModel} from "@/framework";
import APIS from "@/apis";
import {useReflectionData} from "./use-refection-data.ts";
import {ExamStatusEnum} from "@/pages/blog/blog-text/index.ts";
import {ElMessage, ElMessageBox} from "element-plus";

/**
 * 获取映射数据
 */
const {reflections, getReflectionData} = useReflectionData()
getReflectionData()

/**
 * 页面模型
 */
const pageModelRef = ref()
const config = definePageModel<any>({
  url: APIS.BLOG_TEXT,
  getImmediate: true,
  searchForm: {
    beforeSubmit(data) {
      if (data.endTime) {
        data.endTime += " 23:59:59"
      }
      return data
    },
    els: [
      {
        eType: "el-input",
        prop: "code",
        props: {
          placeholder: "文章编码",
          clearable: true
        }
      },
      {
        eType: "el-input",
        prop: "name",
        props: {
          placeholder: "文章标题",
          clearable: true
        }
      },
      {
        eType: "el-select",
        prop: "status",
        props: {
          placeholder:"状态",
          clearable: true
        },
        optionsData: {
          list: convertEnumToList(ExamStatusEnum),
          label: "label",
          value: "value"
        }
      },
      {
        eType: "el-input",
        prop: "content",
        props: {
          placeholder: "文章内容",
          clearable: true
        }
      },
      {
        eType: "el-date-picker",
        prop: "startTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-起始",
          clearable: true
        }
      },
      {
        eType: "el-date-picker",
        prop: "endTime",
        props: {
          valueFormat: "YYYY-MM-DD",
          placeholder: "创建时间-结束",
          clearable: true
        }
      },
    ]
  },
  programForm: {
    els: [
      {
        label: "新增",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "add"
      },
      {
        label: "审核通过",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "pass"
      },
      {
        label: "审核不通过",
        eType: "el-button",
        props: {
          type: "primary"
        },
        event: "un-pass"
      }
    ]
  },
  table: {
    selection: true,
    page: {
      enable: true,
      pageSize: 20
    },
    operation: {
      width: 100,
      els: [
        {
          eType: "el-button",
          label: "编辑",
          event: "edit",
          props: {
            type: "primary",
            link: true
          }
        },
        {
          eType: "el-button",
          label: "删除",
          event: "delete",
          props: {
            type: "primary",
            link: true
          }
        },
      ]
    },
    props: {
      stripe: true,
      border: true
    },
    els: [
      {
        label: "文章编码",
        prop: "code",
        minWidth: 120
      },
      {
        label: "文章标题",
        prop: "name",
        minWidth: 120
      },
      {
        label: "文章内容",
        prop: "content",
        minWidth: 120
      },
      {
        label: "文章阅读量",
        prop: "readCount",
        minWidth: 120
      },
      {
        label: "用户编码",
        prop: "userCode",
        minWidth: 120
      },
      {
        label: "用户名称",
        prop: "userName",
        minWidth: 120
      },
      {
        label: "审核状态",
        prop: "status",
        minWidth: 120,
        renderFn(data) {
          const type = data.status === ExamStatusEnum['待审核'] ? "warning" : data.status === ExamStatusEnum['审核通过'] ? "success" : "danger"
          return <el-tag type={type}>{ExamStatusEnum[data.status]}</el-tag>
        }
      },
      {
        label: "创建时间",
        prop: "createTime",
        minWidth: 200,
        renderFn(data) {
          return <span>{data.createTime?.split(' ')[0]}</span>
        },
      },
    ]
  },
  form: {
    title: "新增/编辑",
    width: 500,
    sheetForm: {
      labelWidth: "120px",
      required: ['userId', 'userName', 'code', 'name', 'content', 'readCount'],
      els: [
        {
          label: "用户名称",
          prop: "userId",
          eType: "el-select",
          props: {
            placeholder: "用户名称",
            clearable: true
          },
          optionsData: {
            reflect: "userList",
            label: "name",
            value: "id"
          }
        },
        {
          label: "文章编码",
          prop: "code",
          eType: "el-input",
          props: {
            placeholder: "文章编码",
            clearable: true
          }
        },
        {
          label: "文章标题",
          prop: "name",
          eType: "el-input",
          props: {
            placeholder: "文章标题",
            clearable: true
          }
        },
        {
          label: "文章内容",
          prop: "content",
          eType: "el-input",
          props: {
            placeholder: "文章内容",
            clearable: true,
            type: "textarea",
            rows: 3
          }
        },
      ]
    }
  }
})

/**
 * 新增
 */
const handleAdd = () => {
  pageModelRef.value.handleAdd()
}

/**
 * 编辑
 */
const handleEdit = (row: any) => {
  pageModelRef.value.handleEdit(row)
}

/**
 * 删除
 */
const handleDelete = (row: any) => {
  pageModelRef.value.handleDelete(row)
}

/**
 * 刷新
 */
const handleRefresh = () => {
  pageModelRef.value.refreshTableData()
}

/**
 * 审核
 */
const handlePass = async () => {
  const selection = pageModelRef.value.getTableSelectData()
  if (selection.length === 0) {
    ElMessage.warning("请至少选择一条单据")
    return false
  }
  const list = selection.filter((item: any) => item.status === ExamStatusEnum['待审核'])
  if (list.length === 0) {
    ElMessage.warning("只有待审核的单据才可以审核通过")
    return false
  }
  await ElMessageBox.confirm("是否确认审核通过?", "审核", {
    type: "warning"
  })
  await processRequest.post("/api/BlogText/Pass", {
    ids: list.map((item: any) => item.id)
  }, {
    isLoading: true
  })
  ElMessage.success("审核通过")
  handleRefresh()
}

/**
 * 审核不通过
 */
const handleUnPass = async (row: any) => {
  const selection = pageModelRef.value.getTableSelectData()
  if (selection.length === 0) {
    ElMessage.warning("请至少选择一条单据")
    return false
  }
  const list = selection.filter((item: any) => item.status === ExamStatusEnum['待审核'])
  if (list.length === 0) {
    ElMessage.warning("只有待审核的单据才可以审核通过")
    return false
  }
  await ElMessageBox.confirm("是否确认审核不通过?", "审核", {
    type: "warning"
  })
  await processRequest.post("/api/BlogText/UnPass", {
    ids: list.map((item: any) => item.id)
  }, {
    isLoading: true
  })
  ElMessage.success("审核不通过成功")
  handleRefresh()
}
</script>

<template>
  <PageModel ref="pageModelRef" :PageModel="config" :reflections="reflections" @add="handleAdd" @delete="handleDelete"
             @edit="handleEdit" @pass="handlePass" @un-pass="handleUnPass"/>
</template>

<style lang="scss" scoped>

</style>